{template 'header'}
<link rel="stylesheet" href="../addons/mx_shop/resources/cgc/css/user/regs.css">
<body>

<div class="reg_wrap">
    <div class="headers">
        <div class="logo"><img src="../addons/mx_shop/resources/cgc/images/bind.png" alt=""></div>
        <p class="tit" style="color: #87baff;">绑定手机号</p>
        <!--<div class="xian"><img src="../addons/mx_shop/resources/cgc/images/xian.png" alt=""></div>-->
    </div>

    <div class="content" style="margin-top: .5rem;">
        <div class="inputwrap">
            <div class="mui-input-row">
                <i class="iconfont icon-shouji"></i>
                <input type="text" placeholder="输入手机号" id="phonum">
            </div>
            <div class="mui-input-row clearfix">
                <i class="iconfont icon-buchongiconsvg02"></i>
                <input type="text" placeholder="输入验证码" class="yzm fl" id="yzm">
                <p class="send_yzm fr" @click="flag && funYzm()" >获取验证码</p>
            </div>
            <div class="mui-input-row">
                <i class="iconfont icon-suo"></i>
                <input type="password" placeholder="输入密码" id="pass">
            </div>
            <div class="mui-input-row">
                <i class="iconfont icon-suo"></i>
                <input type="password" placeholder="确认密码" id="qrpass">
            </div>
        </div>
        <div class="zhuce" @click="reg();" style="background: #5686ed;">立即绑定</div>
        <!--<p class="text">已有账号？<a href="{php echo mobileUrl('user/login')}"><span>立即登录</span></a></p>-->
        <input type="hidden" value="{$token}" id="token">
    </div>

</div>
<script>
    var vm=new Vue({
       el:".reg_wrap",
        data:{
            flag:true
        },
        methods:{
            funYzm:function(){

                var phonum=$("#phonum").val(),

                        token = $("#token").val();

                if(phonum==""){
                    $.show("请输入手机号");return;
                }

                if(!mainApp.isPhone(phonum)){
                    $.show("请输入正确的手机号");
                    return;
                }

                var _this=this;
                var time=60;

                this.flag=false;

                this.$http({
                    method:'POST',
                    url:mainApp.getUrl('sms/getRegCode'),
                    params:{phone:phonum,token:token,temp:'sms_bind'},
                    emulateJSON:true
                }).then(function(msg){

                    if(msg.data.status==1){
                        $.succeed("发送成功");
                        var timer=setInterval(function(){
                            time--;
                            $(".send_yzm").text(time+'s');
                            if(time==0){
                                $(".send_yzm").text("获取验证码");
                                _this.flag=true;
                                clearInterval(timer);
                                time=60;
                            }
                        },1000);
                    }else{
                        _this.flag=true;
                        $.show(msg.data.result.message);
                    }

                });
            },

            reg:function(){
                var phonum=$("#phonum").val(),
//                     pattern = /0?(13|14|15|17|18|19)[0-9]{9}/,
                        yzm=$("#yzm").val(),
                        pass = $("#pass").val(),
                        qrpass  = $("#qrpass").val(),
                        token = $("#token").val();
//                console.log(this)
                if(phonum==""){
                    $.show("请输入手机号");return;
                }

                if(!mainApp.isPhone(phonum)){
                    $.show("手机号格式不正确");return;
                }

                if(yzm==""){
                    $.show("请输入验证码");return;
                }

                if(pass==""){
                    $.show("请输入密码");return;
                }

                if(pass.length<6 || pass.length>20){
                    $.show("请输入6-20位的密码");return;
                }

                if(qrpass==""){
                    $.show("请再次输入密码");return;
                }

                if(pass != qrpass){
                    $.show("两次密码不一致");return;
                }

                this.$http({
                    method:'POST',
                    url:mainApp.getUrl('user/bind'),
                    params:{phone:phonum,pwd:pass,code:yzm,pwd2:qrpass,token:token},
                }).then(function(msg){
                    if(msg.data.status==1){
                        $.succeed("绑定成功");
                        /*setTimeout(function(){
                            window.location.href=mainApp.getUrl('user/login');
                        },1000);*/
                    }else{
                        $.show(msg.data.result.message);
                    }
                });


            },
        }
    });
</script>
</body>
</html>